<template>
	<div class="alert alert-dismissible" :class="`alert-`+type" v-show="visable">
        <button type="button" class="close" @click="close">&times;</button>
        <i class="fa fa-exclamation-circle"></i> {{msg}}
    </div>
</template>
<script>
export default {
	name: 'alert',
	props: {
		value: {
			type: Boolean,
			default: false,
		},
		type: {
			type: String,
			default: 'warning'
		},
		msg: {
			type: String,
			default: '这是条alert提示信息'
		}
	},
	data(){
		return {
			visable: this.value,
		}
	},
	watch: {
		value(val){
			this.visable = Boolean(val)
		},
		visable(val){
			this.$emit('input', val);
		}
	},
	methods: {
		close(){
			this.visable = !this.visable
		}
	}
}
</script>